<template>
    <div>
        <hd-tab :tabs="tabs"/>
        <el-card class="box-card" shadow="never">
            <div slot="header" class="clearfix">
                <span>普通会员</span>
            </div>
            <el-table
                :data=users
                border
                size="mini"
                style="width: 100%">
                <el-table-column
                    label="ID"
                    prop="id"
                    width="80">
                </el-table-column>

                <el-table-column
                    label="名称"
                    prop="name"
                >
                </el-table-column>

                <el-table-column
                    label="联盟会员"
                    prop="member"
                >

                </el-table-column>
                <el-table-column
                    label="卡券金额"
                    prop="voucher_sum"
                >

                </el-table-column>

                <el-table-column
                    label="卡券数量（张）"
                    prop="vouchers_count"
                >
                </el-table-column>
                <el-table-column
                    label="介绍"
                    prop="introduce"
                >

                </el-table-column>

                <el-table-column
                    label="手机号"
                    prop="mobile"
                >
                </el-table-column>

                <el-table-column
                    #default="{row:user}"
                    label="操作"
                    width="200">
                    <el-button-group>
                        <el-button size="mini" type="primary" @click="edit(user)">编辑</el-button>
                        <el-button size="mini" type="danger" @click="del(user)">删除</el-button>
                    </el-button-group>
                </el-table-column>
            </el-table>

        </el-card>

    </div>
</template>

<script>
import tabs from './tabs'

export default {
    route: {name: 'admin.user.normal', meta: {title: '普通会员'}},
    data() {
        return {
            users: [],
            tabs
        }
    },
    async created() {
        await this.load()
    },
    methods: {
        //加载评论
        async load() {
            this.users = await this.axios.get(`user/normal`);
        },
        del(user) {
            this.$confirm('确定删除吗？', '提示').then(async () => {
                await this.axios.delete(`user/${user.id}`)
                this.users.splice(this.users.indexOf(user), 1)
            })
        },
        edit(user) {
            this.$router.push({name: 'admin.user.edit', params: {id: user.id}});
        }
    }
}
</script>

<style>
.el-carousel__item h3 {
    color: #475669;
    font-size: 14px;
    opacity: 0.75;
    line-height: 200px;
    margin: 0;
}

.el-carousel__item:nth-child(2n) {
    background-color: #99a9bf;
}

.el-carousel__item:nth-child(2n+1) {
    background-color: #d3dce6;
}
</style>
